<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <script
            src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"></script>
        <link rel="stylesheet"
            href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
        <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
        <script
            src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
        <title>Document</title>
    </head>
    <body class="container">
        <h3 id="mb-4">添加标签导航</h3>
        <div class="card">
            <div class="card-header">
                <ul class="nav">
                    <li class="nav-item">
                        <a href="#cinema" class="nav-link active" data-toggle="tab">电影</a>
                    </li>
                    <li class="nav-item">
                        <a href="#" class="nav-link ">电视剧</a>
                    </li>
                    <li class="nav-item">
                        <a href="#" class="nav-link ">动漫</a>
                    </li>
                    <li class="nav-item">
                        <a href="#" class="nav-link ">古装剧</a>
                    </li>
                    <li class="nav-item">
                        <a href="#" class="nav-link ">肥皂剧</a>
                    </li>
                </ul>
            </div>
            <div class="card-body tab-content">
                <div class="tab-pane fade show active" id="cinema">
                    <div class="card-body">
                        <h5 class="card-title">电影</h5>
                        <p class="card-text">
                            <input type="text" class="form-control"/>
                        </p>
                        <a href="#" class="btn btn-primary">搜索</a>
                    </div>
                </div>
            </div>
        </div>
    </body>
</html>